<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<title>视频课程页</title>
		<script src="../../script/jquery.min.js" type="text/javascript"></script>
		<script src="../../script/timecontrol.min.js"></script>
		<link rel="stylesheet" type="text/css" href="../../css/api.css" />
		<link rel="stylesheet" href="../../css/aui.css"/>
		<link rel="stylesheet" type="text/css" href="../../css/weui.min.css" />
		<link rel="stylesheet" href="../../css/base.css"/>
		<link rel="stylesheet" href="../../css/timecontrol.min.css" />
		<link rel="stylesheet" href="../../css/CFNetPP_Base.css">
		<style type="text/css">
			html, body {
				background-color: #FFFFFF;
			}
			.weui_media_box:before {
				content: " ";
				position: absolute;
				left: 0;
				top: 0;
				width: 100%;
				height: 1px;
				border-top: 1px solid #E5E5E5;
				color: #E5E5E5;
				-webkit-transform-origin: 0 0;
				transform-origin: 0 0;
				-webkit-transform: scaleY(0.5);
				transform: scaleY(0.5);
				left: 0px;
			}
			.course-image {
				background-image: url(../../image/course_placehoder.png);
				background-size: 100% 80px;
			}
			.aui-list .aui-list-item-media img {
				width: 100%;
				height: 80px;
				display: block;
			}
			.aui-list .aui-list-item-media {
				width: 5.5 rem;
			}
		</style>
	</head>
	<body>
		<div id="main" style="margin-top: 0;" class="certification">
			<div class="aui-content aui-margin-b-15 bgwhite">
				<ul class="aui-list aui-media-list" id="list_id">
					<!--      <li dataid="' + index + '" class="aui-list-item list_cell" >
					<div class="aui-media-list-item-inner ">
					<div class="aui-list-item-media" id="one">
					<img src="../../image/list-default.png" class="course-image">
					</div>
					<div class="aui-list-item-inner top_5">
					<div class="aui-list-item-text" id="two">
					<div class="aui-list-item-title">
					jjjj
					</div>
					</div>
					<div class="aui-list-item-text" id="two">
					<div class="aui-list-item-title">
					list.cdetailtitle
					</div>
					</div>
					</div>
					</div>
					</li>-->
				</ul>
				<div class="noSign"   id="noData"  hidden="hidden">
					<img src="../../image/icon_img.png" width="60%">
					<p class="font16 top_15 base_dark_grey" >
						暂无数据
					</p>
				</div>
				<div class="loadFailure" hidden="hidden" id="noNet">
					<img src="../../image/icon_img01.png" width="60%">
					<p class="" >
						数据加载失败
					</p>
					<p>
						请检查您的网络
					</p>
					<button type="button" class="mui-btn mui-btn-outlined" onclick="RefreshData()">
						重新加载
					</button>
				</div>
				<div class="weui_dialog_confirm" id="TestCodeAlert" style="display: none">
					<div class="weui_mask"></div>
					<div class="weui_dialog">
						<div class="weui_dialog_hd">
							<strong class="weui_dialog_title" id="checkNum">当前处于非wifi条件下,是否继续观看视频</strong>
						</div>
						<div class="weui_dialog_bd"></div>
						<div class="weui_dialog_ft">
							<a onclick="TestCodeNo()" href="#" class="weui_btn_dialog default" style="color:#18b4ed">取消</a>
							<a onclick="TestCodeYes()" href="#" class="weui_btn_dialog primary"  style="color:#18b4ed">确定</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/MD5.js"></script>
	<script src="../../script/common.js"></script>
	<script src="../../script/timeStampTool.js"></script>
	<script src="../../script/jquery.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="../../script/requestTool.js"></script>
	    <script type="text/javascript" src="../../script/getToken.js"></script>
	<script type="text/javascript">
		var refreshCount = 0;
		//更新数据条数
		var dataArr = new Array();
		var weightratio = new Array();
		var yuyueidArr = new Array();
		var id = '';
		var page = 1;
		var row = 10;
		var courseimg = '';
		var chaptername = "";
		var chapterVideourl = "";
		apiready = function() {
		api.setScreenOrientation({
				orientation : 'portrait_up'
			});
			showProgress();
			loadNewData();
			setRefreshHeader();
			setPullUpRefresh();
		}
		function loadNewData() {
			page = 1;
			loadData();
		}

		function loadMoreData() {
			page++;
			loadData();
		}

		//考试编码正确，点击确定按钮,显示选择考核弹窗
		function TestCodeYes() {
			$('#TestCodeAlert').hide();
			
			pushToBaiDuPlayer(0, '', chapterVideourl, chaptername);
//			toPlayVideo(chapterVideourl, chaptername);
		}

		//点击考试编码取消按钮，隐藏考试编码弹窗
		function TestCodeNo() {
			$('#TestCodeAlert').hide();
		}

		//请求得到数据
		function loadData() {
			var param = {
				kid : api.pageParam.courseid,
				uid : $api.getStorage('cfnetppuid'),
				page : page,
				rows : row,
			};
			
			cfnetppPOST(url_VideoCourseList, param, true, function(data, status) {
				
				api.refreshHeaderLoadDone();
				hideProgress();
				if (status == 'success') {
					if (data.code == 200) {
						var list = data.data.date;
						if (list != null && list.length > 0) {
							refreshCount = list.length;
							var listArr = new Array();
							var htmlString = new String();
							if (page == 1) {
								for (var i = 0; i < list.length; i++) {
									var weeklyData = list[i];
									var data = {
										id : weeklyData.id,
										cdetailtitle : weeklyData.cdetailtitle,
										rid : weeklyData.url,
									};
									listArr.push(data);
									htmlString += htmlStringWithName(data, i);
								}
								dataArr = listArr;
								$('#list_id').html(htmlString);
							} else {
								var oldCount = dataArr.length;
								for (var i = 0; i < list.length; i++) {
									var index = oldCount + i;
									var weeklyData = list[i];
									var data = {
										id : weeklyData.id,
										cdetailtitle : weeklyData.cdetailtitle,
										rid : weeklyData.url,
									};
									listArr.push(data);
									htmlString += htmlStringWithName(data, index);
								}
								dataArr = dataArr.concat(listArr);
								$('#list_id').append(htmlString);
							}
							setupTapCellClick();
						} else {
							if (page == 1) {
								$('#noData').show();
							} else {
								api.toast({
									msg : '暂无数据',
									duration : 2000,
									location : 'bottom'
								});
							}
//							$('#list_id').html('');
						}
					} else {
						if (page == 1) {
							$('#list_id').html('');
							$('#noData').show();
						}
					}
				} else {
					$('#noNet').show();
				}
			});
		}

		//html代码拼接
		function htmlStringWithName(list, index) {
			var keshi = "课时 " + (index + 1);
			return '<li dataid="' + index + '" class="aui-list-item list_cell" >' + '<div class="aui-media-list-item-inner ">' + '<div class="aui-list-item-media" id="one">' + '<img src="' + httpImgUrl(api.pageParam.img) + '" onerror="Imgnofind()">' + '</div>' + '<div class="aui-list-item-inner top_5">' + '<div class="aui-list-item-text" id="two">' + '<div class="aui-list-item-title">' + keshi + '</div>' + '</div>' + '<div class="aui-list-item-text" id="two">' + '<div class="aui-list-item-title">' + list.cdetailtitle + '</div>' + '</div>' + '</div>' + '</div>' + '</li>'
		}

		//列表点击
		function setupTapCellClick() {
			$('.list_cell').unbind('click');
			$('.list_cell').click(function() {
				var dataid = $(this).attr('dataid');
				var data = dataArr[parseInt(dataid)];
				var videourl = data.rid;
				if (videourl != null && videourl != undefined && videourl != '' && videourl != NaN) {
					if (videourl.substr(0, 7) == "http://") {
						chaptername = data.cdetailtitle;
						chapterVideourl = videourl;
						//					api.openWin({useWKWebView:true,
						//						name : 'Student_FreeCourseVideo',
						//						url : 'Student_FreeCourseVideo.html',
						//						pageParam : {
						//							videourl : videourl,
						//							videoname : data.cdetailtitle
						//						}
						//					});
						var connectionType = api.connectionType;
						if (connectionType == 'wifi' || connectionType == 'none') {
//							toPlayVideo(chapterVideourl, chaptername);
								pushToBaiDuPlayer(0, '', chapterVideourl, chaptername);
						} else {
							$('#TestCodeAlert').show();
						}
					} else {
						ShowToast('视频地址不支持');
					}
				} else {
					ShowToast('此章节无视频');
				}
			});
		}

		function toPlayVideo(videourl, videoname) {
			//	alert(videourl);
			var videoPlayer = api.require('videoPlayer');
			videoPlayer.play({
				path : videourl,
				texts : {
					head : {
						title : videoname
					}
				},
				styles : {
					head : {
						backSize : 24,
						backImg : 'widget://image/vp_back.png',
						setSize : 24,
						setImg : 'widget://image/vp_more.png'
					},
					foot : {
						playSize : 24,
						playImg : 'widget://image/vp_play.png',
						pauseImg : 'widget://image/vp_pause.png',
						nextSize : 24,
						nextImg : 'widget://image/vp_next.png'
					}
				}
			}, function(ret, err) {
			});
		}
	</script>
</html>